<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<!-- <link rel="stylesheet" href="../css/header.css" /> -->
	</head>

	<body>
		<!-- 头部标题栏 -->
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<a id="openMenu" class="mui-icon mui-icon-right-nav mui-pull-right">...</a>
			<h1 class="mui-title">个人头像</h1>
		</header>
		
		<!-- 主体部分 -->
		<div class="mui-content">
			<img id="img_myface" src="css/registLogin/bear.jpeg" />
		</div>
		
		<!-- 操作表 -->
		<div id="sheet_myface" class="mui-popover mui-popover-bottom mui-popover-action ">
			<!-- 可选择菜单 -->
			<ul class="mui-table-view">
			  <li class="mui-table-view-cell">
				<a id="link_chosePhoto" href="#">选择头像</a>
			  </li>
			  <li class="mui-table-view-cell">
				<a id="link_savePhoto" href="#">保存头像</a>
			  </li>
			</ul>
			<!-- 取消菜单 -->
			<ul class="mui-table-view">
			  <li class="mui-table-view-cell">
				<a href="#sheet_myface"><b>取消</b></a>
			  </li>
			</ul>
		</div>
		<script src="js/app.js"></script>
		<script src="js/mui.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function () {
				//获取全局用户信息
			    var user=app.getUserGlobalInfo();
				
				var img_myface=document.getElementById("img_myface");
				
				//获取用户头像图片
				if(user!=null){
					var faceImage=user.faceImage;
					if(app.isNotNull(faceImage)){
						img_myface.src=app.imgServerUrl+faceImage;
						console.log(app.imgServerUrl+faceImage);
					}
				}
				//设置图片展示的尺寸
				var imageWidth=document.body.clientWidth;
				img_myface.width=imageWidth;
				img_myface.height=imageWidth;
				
				//个人头像设置
				document.getElementById("openMenu").addEventListener("tap",function(){
					mui("#sheet_myface").popover("toggle");
				});
				
				//选择头像事件
				document.getElementById("link_chosePhoto").addEventListener("tap",function(){
					mui.openWindow("plugin/v3.1.6/myface-uploader.html","myface-uploader.html");
					mui("#sheet_myface").popover("toggle");
				});
				
				//保存头像事件
				document.getElementById("link_savePhoto").addEventListener("tap",function(){
					alert("头像已保存");
				});
			});
		</script>
	</body>

</html>
